window.utils = {};
window.utils.ontouchtof = "ontouchend" in document?true:false;

window.utils.capture = function(element){
    console.log(window.utils.ontouchtof);
    if(window.utils.ontouchtof){
        return window.utils.captureTouch(element);

    }else{
       return window.utils.captureMouse(element);
    }
}

// 鼠标事件
window.utils.captureMouse = function(element){
    
    // 定义 mouse的对象
    var mouse = {x:0,y:0};

    // 判断是否支持touch事件
    var isSupportTouch = "ontouchend" in document ? true : false;

    // 绑定事件
    element.addEventListener("mousemove",function(event){
        //console.time("--")
        
        var x,y;

        // 获取鼠标位于当前屏幕的位置，并做兼容处理
        if(event.pageX || event.pageY){
            x = event.pageX;
            y = event.pageY;
        }
        else{
            x = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
            y = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;
        }

        // 将当前坐标减去元素偏移位置，即为鼠标位于当前canva的位置
       /* x-=element.offsetLeft;
        y-=element.offsetTop;*/

        // 第二种获得坐标的方法   getBoundingClientRect() 包含四个属性：left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。
        var box = element.getBoundingClientRect();
        x = (x-box.left)*(element.width/box.width);
        y = (y-box.top)*(element.height/box.height)
        mouse.x = x;
        mouse.y = y;
        //console.timeEnd("--")
    },false);
   
    return mouse;
}

// 触摸事件
window.utils.captureTouch = function(element){
    var touch = {
        x:null,
        y:null,
        ispressed:false,
        event:null
    }

    var body_scrollLeft = document.body.scrollLeft,
        element_scrollLeft = document.documentElement.scrollLeft,
        body_scrollTop = document.body.scrollTop,
        offsetLeft = element.offsetLeft,
        offsetTop = element.offsetTop;
    
    // 绑定touchstart 事件
    element.addEventListener('touchstart',function(event){
        touch.ispressed = true;
        setxy();
        //touch.event = event;
    },false);

    // 绑定 touchend 事件
    element.addEventListener('touchend',function(event){
        touch.ispressed = false;
        touch.x = null;
        touch.y = null;
        touch.event = event;
    },false)  

    // 绑定 touchmove 事件
    element.addEventListener('touchmove',function(event){
        setxy();

    },false)  


    var setxy = function(){
         var x, y, 
         touch_event = event.touches[0];  // 第一次touch
        
        if(touch_event.pageX || touch_event.pageY){
            x = touch_event.pageX;
            y = touch_event.pageY;
        }
        else{
            x = touch_event.clientX + body_scrollLeft + element_scrollLeft;
            y = touch_event.clientY + body_scrollTop + element_scrollTop;
        }

        // 减去偏移量
        x -= offsetLeft;
        y -=offsetTop;

        touch.x = x;
        touch.y = y;
        touch.event =event;
    }
    console.log(touch)
    return touch;
}

// 解析色彩
window.utils.parseColor = function (color, toNumber) {
  if (toNumber === true) {
    if (typeof color === 'number') {
      return (color | 0); //chop off decimal
    }
    if (typeof color === 'string' && color[0] === '#') {
      color = color.slice(1);
    }
    return window.parseInt(color, 16);
  } else {
    if (typeof color === 'number') {
      color = '#' + ('00000' + (color | 0).toString(16)).substr(-6); //pad
    }
    return color;
  }
};


//  碰撞
window.utils.containsPoint = function(rect, x, y){
    return !(x<rect.x || x>rect.x + rect.width ||
             y<rect.y || y>rect.y + rect.height);
}

// 碰撞检测
utils.intersects = function(rectA, rectB){
    return !(rectA.x + rectA.width < rectB.x ||
             rectB.x + rectB.width < rectA.x ||
             rectA.y + rectA.height < rectB.y ||
             rectB.y + rectB.height < rectA.y);
}


// 键盘事件
window.utils.capturnkey = function(event){
    var keycode = "";
    keycode = event.keyCode;
    return keycode;
}



// 动画循环
if(!window.requestAnimationFrame){
    window.requestAnimationFrame = (window.webkitRequestAnimationFrame || 
                                    window.mozRequestAnimationFrame || 
                                    window.msRequestAnimationFrame ||
                                    window.oRequestAnimationFrame ||
                                    function (callback){
                                        return window.setTimeout(callback,17/*~1000/60*/)
                                    });
}

// 动画循环取消
if(!window.cancelAnimationFrame){
    window.cancelAnimationFrame = (window.cancelRequestAnimationFrame ||
                                   window.webkitCancelAnimationFrame || window.webkitCancelRequestAnimationFrame ||
                                   window.mozCancelAnimationFarme || window.mozCancelRequestAnimationFrame ||
                                   window.msCancelAnimationFarme || window.msCancelRequestAnimationFrame ||
                                   window.oCancelAnimationFrame || window.oCancelRequestAnimationFrame||
                                   window.clearTimeout);
}